{% extends 'base_dashboard.html' %}

{% block title %}Exam schedules — {{ site_settings.institute_name }}{% endblock %}

{% block content %}
<div class="d-flex justify-content-between mb-4 flex-wrap gap-2">
  <div>
    <h4 class="fw-bold mb-1">Exam schedules</h4>
    <p class="text-muted small mb-0">Bookable slots at testing centers</p>
  </div>
  <div class="d-flex gap-2">
    <a href="?upcoming=1" class="btn btn-outline-secondary btn-sm">Upcoming</a>
    <a href="{% url 'certifications:admin_schedule_create' %}" class="btn btn-primary btn-sm">Add slot</a>
  </div>
</div>

{% if centers %}
<form method="get" class="mb-3">
  <select name="center" class="form-select form-select-sm w-auto d-inline-block" onchange="this.form.submit()">
    <option value="">All centers</option>
    {% for c in centers %}
      <option value="{{ c.pk }}" {% if center_filter == c.pk|stringformat:'s' %}selected{% endif %}>{{ c.name }}</option>
    {% endfor %}
  </select>
</form>
{% endif %}

<div class="card border-0 shadow-sm rounded-4">
  <div class="table-responsive">
    <table class="table mb-0 align-middle">
      <thead class="table-light">
        <tr>
          <th class="ps-4">Center</th>
          <th>Date / time</th>
          <th>Program</th>
          <th>Seats</th>
          <th>Active</th>
          <th class="pe-4"></th>
        </tr>
      </thead>
      <tbody>
        {% for slot in slots %}
        <tr>
          <td class="ps-4">{{ slot.center.name }}</td>
          <td>{{ slot.label }}</td>
          <td>{{ slot.program.title|default:"Any" }}</td>
          <td>{{ slot.booked_count }} / {{ slot.capacity }}</td>
          <td>{% if slot.is_active %}Yes{% else %}No{% endif %}</td>
          <td class="pe-4 text-end">
            <a href="{% url 'certifications:admin_schedule_edit' slot.pk %}" class="btn btn-sm btn-outline-primary">Edit</a>
            <form method="post" action="{% url 'certifications:admin_schedule_delete' slot.pk %}" class="d-inline" onsubmit="return confirm('Delete this slot?');">
              {% csrf_token %}
              <button class="btn btn-sm btn-outline-danger">Delete</button>
            </form>
          </td>
        </tr>
        {% empty %}
        <tr><td colspan="6" class="text-center text-muted py-5">No schedule slots yet.</td></tr>
        {% endfor %}
      </tbody>
    </table>
  </div>
</div>
{% endblock %}